<gm:page title="AutoComplete" onload="init();" authenticate="false">
  <script>
    function init()
    {
       var field=google.mashups.getObjectById("field").getData();
       var entry = field.createEntry();
       new GPath("atom:title").setValue(entry,"test");
       field.addEntry(entry);
    }
  </script>
  
  <div style="margin: 25%; width: 600px">
    <gm:list id="field" data="${tmp}/autocomplete2" template="default"/>
    <gm:item template="autocomplete" create="true">
      <gm:handleEvent src="field" event="select"/>
    </gm:item>
  </div> 
  <gm:template id="autocomplete">
    <table width="100%"> 
      <thead>
        <tr>
          <th colspan="4" style="background-color: lightblue">Movie Comments</th>
        </tr>
        <tr>
          <th style="text-align:left">Movie Title</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td><gm:editButtons/></td><td><gm:autoComplete ref="atom:title" data="http://www.martinsteiner.com/SAPData/MaterialDetail?responseType=atom" value="atom:title" /></td>
        </tr>
      </tbody>
    </table>
  </gm:template>
</gm:page> 